<?php include_once('/includes/header.php');?>
<?php include_once(inc('sql.php'));?>
<?php include_once(inc('repository.php'));?>
<?php include_once(inc('chart.php'));?>
<?php
	parameters_check($_REQUEST['id']);
	$user =  User::get_by_id(intval($_REQUEST['id']));
	if(!$user){
		to_403();
		exit();
	}
?>
<div id="main">
	<span class="panel_title"><?php _("个人信息"); ?></span>
	<div id="dashboard" class="content" user-id="<?php e($user['id'])?>">
		<div class="avatar">
		<a href="javascript:void(0)"  title="修改头像" class="img_link" id="change_avatar">
		<?php if(is_avatar_exist( $_SESSION['user']['id'] )): ?>
			<img src="<?php avatar_url( $user['id'] ) ?>" class="circle"/>
		<?php else: ?>
			<img src="/assets/images/avatar.png" class="circle"/>
		<?php endif ?>
		</a>
		</div>
		<div class="basic_info">
			<span class="name"><?php e($user['name'])?></span>
			<div class="detail">
				<div>邮箱<span class="colon">:</span><?php e($_SESSION['user']['email'])?></div>
			</div>
		</div>
		<div class="clear"></div>
		<div id="charts">
			<div class="chart">
			<div class="title">单词熟悉度</div>
			<div id="familiarity_pie" style="width:300px;height:200px;"></div>
			</div>
			<div class="chart">
			<div class="title">最近十天的单词收藏量</div>
			<div id="words_increment" style="width:550px;height:300px;"></div>
			</div>
		</div>
	</div>
</div>
<div class="dialog corner hidden" id="upload_avatar_dialog">
	<form id="avatar_upload_form" action="/handlers/upload_handler.php?type=avatar" method="post" enctype="multipart/form-data">
	<div class="dialog_header">上传头像</div>
	<div class="dialog_content file_input">
		<input type="file" id="note_id" name="my_file" />
		<div id="progress">
	        <div id="bar"></div>
		</div>
		<div class="message"></div>
	</div>
	<div class="dialog_footer">
		<input type="submit" class="btn" value="上传头像" id="btn_upload_avatar" />&nbsp;&nbsp;
		<a href="javascript:void(0)" class="btn_close_dialog">取消</a>
	</div>
	</form>
</div>
<script type="text/javascript" src="/assets/javascripts/jquery.form.js"></script>
<?php 
	Chart::js('pie');
	Chart::js('stack',false);
?>
<script type="text/javascript">
	$(function(){
		/*pie*/
		var data_familiarity_pie=<?php echo json_encode(Chart::data_familiarity_pie($user['id']))?>;
		VocaChart.pie($('#familiarity_pie'),data_familiarity_pie);
		/*line*/
		<?php
			$word_increment_data=Chart::data_words_increment($user['id']);
		?>

		var stack = 0,bars = true,lines = false,steps = true;
		var data=[
			<?php echo json_encode($word_increment_data['subsum'])?>, 
			<?php echo json_encode($word_increment_data['sum'])?>
		];
		var opinions={
			series:{
				stack:stack,
				lines: {
					show: lines,
					fill: true,
					steps: steps
				},
				bars: {
					show: bars,
					align: "center",
					barWidth:0.5,
					fill:1
				}
			},
			grid: {
				hoverable:true,
				borderWidth: 1,
				minBorderMargin: 20,
				labelMargin: 10,
				backgroundColor: {
					colors: ["#fff", "#e4f4f4"]
				},
				margin: {
					top: 8,
					bottom: 20,
					left: 20
				}
			}
		}
		VocaChart.stackbar($('#words_increment'),data,opinions);
		$('#words_increment').chartTooltip(function(item){
			console.dir(item);
			return "<span>" + item.series.label+":" + item.datapoint[1]+ "</span>";
		});
	});
</script>
<?php get_footer();?>